class InputNumber{
    constructor(ops){
        this.min = ops.min || 0;
        this.max = ops.max ||0;
        this.step = ops.step ||1;
        this.value = ops.value || 0;
        this.cont = ops.cont || document.createElement("div");
        this.createDOM();

    }
    createDOM(){
        this.reduce = document.createElement("span");
        this.reduce.className = "reduce";
        this.add = document.createElement("span");
        this.add.className = "add";
        this.ipt = document.createElement("input");
        this.ipt.setAttribute("class","ipt");
        this.reduce.innerText = "-";
        this.add.innerText = "+";
        this.ipt.value = this.value;
        this.cont.appendChild(this.reduce);
        this.cont.appendChild(this.ipt);
        this.cont.appendChild(this.add);
        this.addEvent();
    }
    addEvent(){
        const that = this;
        this.reduce.addEventListener("click",function(){
            let n=that.ipt.value-0;
            if(n===that.min){
                n=that.min;
            }else{
                n -=that.step;
            }
            that.ipt.value = n;
        })
        this.add.addEventListener("click",function(){
            let n = that.ipt.value-0;
            if(n===that.max){
                n=that.max;
            }else{
                n+=that.step;
            }
            that.ipt.value = n;
        })
        this.ipt.addEventListener("input",function(){
            const val = this.value;
            let s="";
            for(let i = 0;i<val.length;i++){
                if(/\d/.test(val[i])){
                    s+=val[i];
                }
            }
            this.value = s;
            if(val === ""||val<=that.min){
                this.value = that.min;
            }
            if(val >= that.max){
                this.value = that.max;
            }
        })
    }
}